<template>
    <view class='page-header p-l-r'>
        <view class='flex-align-items-center'>
            <navigator class='flex-align-items-center flex-1' url='/pages/userInfo/index'>
                <template v-if="userStore.avatar">
                    <NetImage class='user-avatar' mode='widthFix' :src="userStore.avatar" /> 
                </template>
                <template v-else>
                    <image class='user-avatar' mode='widthFix' src="@/assets/images/default-avatar.png" /> 
                </template>
                <view class='greetings-text'>
                    <template v-if="userStore.nickname">{{ userStore.nickname }}，</template>{{ Ggreetings() }}
                </view>
            </navigator>
            <!-- <navigator hoverClass='none' url='/subPages/near/index' class='near-site'>
                <LocalImage class='location-icon' mode="widthFix" src='small-location.png' />
                <text>附近充电站</text>
            </navigator> -->
        </view>
    </view>

    <view class='p-l-r m-t-40'>
        <view class='module'>
            <navigator class='item text-center' url='/innerPages/device/index'>
                <image class='icon' mode='widthFix' src="@img/device.png" /> 
                <view class='title'>我的设备</view>
            </navigator>
            <navigator class='item text-center' url='/innerPages/wallet/index'>
                <image class='icon' mode='widthFix' src="@img/water-amount.png" /> 
                <view class='title'>我的余额</view>
            </navigator>
            <navigator class='item text-center' url='/innerPages/waterBills/index'>
                <image class='icon' mode='widthFix' src="@img/chart.png" /> 
                <view class='title'>用水记录</view>
            </navigator>
            <navigator class='item text-center' url='/innerPages/waterTest/index'>
                <image class='icon' mode='widthFix' src="@img/check-log.png" /> 
                <view class='title'>检测记录</view>
            </navigator>
            <navigator class='item text-center' url='/innerPages/cleanRecord/index'>
                <image class='icon' mode='widthFix' src="@img/clear-log.png" /> 
                <view class='title'>清洗记录</view>
            </navigator>
            <!-- <navigator class='item' url='/chargeOrder/pages/index'>
                <LocalImage class='icon' src='laba.png'></LocalImage>
                <view class='title'>充电记录</view>
            </navigator>
            <navigator class='item' url='/subPages/wallet/index'>
                <LocalImage class='icon' src='wallet.png'></LocalImage>
                <view class='title'>钱包</view>
            </navigator>
            <navigator class='item' url='/subPages/chargingCard/index'>
                <LocalImage class='icon' src='card.png'></LocalImage>
                <view class='title'>充电卡</view>
            </navigator>
            <navigator class='item' url='/subPages/privateDevice/index'>
                <LocalImage class='icon' src='charge-device.png'></LocalImage>
                <view class='title'>私人桩</view>
            </navigator> -->
        </view>
    </view>

    <!-- <view class='p-l-r actionModule'>
        <view class='flex-align-items-center scan-button' @tap="scanQr">
            <image class='scan-icon' mode='widthFix' src='@img/scan.png'></image><text class='m-l-10'>扫码充电</text>
        </view>
        <view class='text-center m-t-20' style='text-decoration: underline;' @tap="inputDeviceNo">输入设备号</view>
    </view> -->

    <LoadingPage v-if="!globalStore.loginStatus" />
</template>

<script lang="ts" setup>
  import { ref } from 'vue';
  import LocalImage from '@/components/LocalImage.vue'
  import NetImage from '@/components/NetImage.vue'
  import { navigateTo, scanCode, showModal, useRouter } from '@/utils/framework'
  import LoadingPage from '@/components/LoadingPage.vue'
    import { useGlobalStore } from '@/stores';
    import { useUserStore } from '@/stores/user';

  const globalStore = useGlobalStore()
  const userStore = useUserStore()

  const router = useRouter()
  
    

  const Ggreetings = () => {
      const date = new Date()
      const hour = date.getHours()
      if(hour >= 19 || hour <= 3) {
      return ('晚上好')
      }else if(hour < 10) {
      return('早上好')
      }else if(hour < 12) {
      return('中午好')
      }else {
      return('下午好')
      }

  }

  function scanQr() { //扫码
    scanCode({
      success: (res) => {
        let deviceId = res.result
        if(deviceId.indexOf('http') == 0) {
          const url = new URL(deviceId)
          deviceId = url.searchParams.get('deviceNo') || ''
        }

        if(deviceId == '') {
          showModal('设备号不合法')
          return
        }

        navToCharge(deviceId)
      }
    })
  }

  function inputDeviceNo() {
    showModal({
        title : '输入设备号',
        editable : true,
        success(res) {
            if(res.confirm) {
                navToCharge(res.content)
            }
            
        }
    })
  }

  function navToCharge(deviceId:string) {
    navigateTo('/pages/charge/index?deviceId=' + deviceId)
  }

  const t = setInterval(() => {
    if(globalStore.loginStatus) {
        clearInterval(t)
        let redirect = router.params.to ?  router.params.to : ''


        // if(userStore.isAuthPhone == false) {
        //     navigateTo('/pages/auth/index?redirect=' + redirect)
        //     return
        // }
        if(!userStore.avatar) {
            navigateTo('/pages/userInfo/index?redirect=' + redirect)
            return
        }
 

        

        // if(redirect) {
        //     navigateTo(decodeURIComponent(redirect))
        // }
    }
  }, 100)

</script>

<style lang="scss" src="./index.scss"></style>